<script setup lang="ts">
import { getCurrentInstance, ref, onMounted } from 'vue'
const { proxy } = getCurrentInstance()

/* ---- */
const props = defineProps<{
  curTabs: Boolean
  curIndex: Number
  items: objAct
}>()

/* ---- */
const show = ref(false)

/* ---- */
const getAuditFun = (type, item) => {
  switch (Number(type)) {
    case 1: {
      item.callback && item.callback(item)
      break
    }
  }
}

/* ---- */
onMounted(() => {
  setTimeout(() => { show.value = true }, 300)
})
</script>

<template>
  <transition name="slideUpFade">
    <footer v-if="curTabs && show">
      <div class="tabs xw-visible xw-foot-Tfg xw-flex">
        <template v-for="(item, index) in items">
          <template v-if="item.show">
            <div class="round xw-radius-round" :class="[Number(curIndex) < 0 ? 'light' : 'dark']" @click="getAuditFun(1, item)" v-if="item.round"><div class="xw-radius-round" :class="[Number(curIndex) < 0 ? 'xw-bgCL-20' : 'xw-bgCL-17']"><a class="xw-flex xw-flex-center">
              <span v-html="item.name"></span>
            </a></div></div>
            <a :class="{'active': Number(index) === Number(curIndex)}" class="xw-flex-W1 xw-flex xw-flex-center" @click="getAuditFun(1, item)" v-else >
              <span><em :class="item.icon"></em>{{item.name}}</span>
            </a>
          </template>
        </template>
      </div>
    </footer>
  </transition>
</template>
